<%@ page language="java" import="java.util.*" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>历史查询 - 清管管理</title>
	<link rel="stylesheet" type="text/css" href="${resourcePath}css/new/pig.css">
    <style>
        td li{position: relative !important;width:100% !important;height:40px}
		.jl_00{
            cursor: pointer;
            top:50%;
            margin-top: -12px;
            position: absolute;
            left: 50%;
            display: inline-block;
            width: 24px;
            height: 24px;
            margin-left: -12px !important;
            vertical-align: middle;
            background: url("${resourcePath}images/risk/icon_details.png") no-repeat center center;
            background-size: 100%;
		}

        .download_00 {
            display: inline-block;
            width: 24px;
            height: 24px;
            position:absolute;
            vertical-align: -9px;
            background: url("${resourcePath}images/pig/icon_enclosure.png") no-repeat center center;
            left:50%;
            margin-left:-13px !important;
            top:50% ;
            margin-top:-12px;
        }
        .download_00:hover{    border-radius: 50%;
            background:  url("${resourcePath}images/pig/icon_enclosure_white.png") no-repeat center center;}
		.jl_00:hover{    background: url("${resourcePath}images/risk/icon_details_white.png") no-repeat center center;
            background-size: 100%;
		}

        #laydate_box{width:243px}
        #laydate_box * {
            box-sizing: content-box !important;
        }
        #laydate_box *::before, #laydate_box *::after {
            box-sizing: content-box  !important;
        }

	</style>
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/eqpt/tabPage.js"></script>
</head>
<body class="body-pad" style="padding-bottom:100px;">
	<input type="hidden" id="taskId" value="${taskId}"/>
	<input type="hidden" id="pagePath" value="${pageContext.request.contextPath}"/>
	<input type="hidden" id="resourcePath" value="${resourcePath}"/>
    <div class="html-header" style="background-color:white;padding-top:0">
        <p class="header-title" style="margin-top:0"><em class="icon-gzgl2"></em>历史查询</p>
    </div>
<div class="container-fluid warp insp-container">
    <div class="row-fluid  bg-white1">
        <div class="main clearFix">
            <div class="cxtj clearFix">
                <div class="fxgl">
                    <p class="fxgl-title">管道名称</p>
                    <div class="sel w320">
                    <div class="zy-select-inner">
                        <blockquote id="JQ_pipeline" class="bk-select"><abbr></abbr></blockquote>
                    </div>
                </div>
                </div>
                <div class="fxgl">
                    <p class="fxgl-title">管段名称</p>
                    <div class="sel w320">
                        <div class="zy-select-inner">
                            <blockquote id="JQ_segment" class="bk-select"></blockquote>
                        </div>
                    </div>
                </div>
                <div class="fxgl br">
                    <p class="fxgl-title">起点位置</p>
                    <div class="sel w320">
                        <div class="zy-select-inner">
                            <blockquote id="JQ_begin" class="bk-select"></blockquote>
                        </div>
                    </div>
                </div>
                <div class="fxgl">
                    <p class="fxgl-title">终点位置</p>
                    <div class="sel w320">
                        <div class="zy-select-inner">
                            <blockquote id="JQ_end" class="bk-select"></blockquote>
                        </div>
                    </div>
                </div>
                <div class="fxgl">
                    <p class="fxgl-title">清管类型</p>
                    <div class="sel w320">
                        <div class="dropdown-list">
                            <div class="drop-list drop-list-min">
                                <div class="checked" id="toolDiv">
                                    <a href="javascript:void(0);" id="qglx">清管类型</a>
                                </div>
                                <span class="down-span"></span>
                            </div>
                            <ul class="select select-min none">
                                <c:forEach items="${requestScope.code}" var="code">
                                    <li onclick="changeMark();"><a href="javascript:void(0);" id="${code.id }" >${code.name}</a></li>
                                </c:forEach>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="fxgl br">
                    <div class="new-sel ">
                        <p class="fxgl-title">清管时间</p>
                        <div class="sel w320" style="position:relative">
                            <input type="text" id="begTime" class="new-input" onclick="laydate({elem: '#begTime',format: 'YYYY-MM-DD'})">
                            <em class="time-icon" onclick="laydate({elem: '#begTime',format: 'YYYY-MM-DD'})"></em>
                        </div>
                    </div>
                    <div class="fg-1">-</div>
                    <div class="new-sel ">
                        <p class="fxgl-title" style="color:white">ioio</p>
                        <div class="sel w320" style="position:relative">
                            <input type="text" class="new-input" id="endTime" onclick="laydate({elem: '#endTime',format: 'YYYY-MM-DD'})" >
                            <em class="time-icon" onclick="laydate({elem: '#endTime',format: 'YYYY-MM-DD'})"></em>
                        </div>
                    </div>
                </div>
                <div class="fxgl br">
                    <p class="fxgl-title" style="color:white"> </p>
                    <a href="javascript:void(0)" class="btn btn-w130 btn-search-icon btn-h40" style="float:left;margin-top:20px" onclick="searchFun();"><em></em>查询</a>
                </div>
                <div style="clear:both"></div>
                <p class="tool pad20" style="margin-top:-41px">
                    <a  class="btn btn-w72 btn-public-icon btn-h30" href="javascript:void(0)" onclick="goEvluation();"><em></em>评价</a>
                </p>
                <div style="clear: both"></div>
                <div class="l-r clearFix pad20" style="margin-top:15px">
                    <div id="historyTable"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<form action="${pageContext.request.contextPath}/pig/cleanPipeLineHistory/goEvluation.html" method="post" >
	<input type="hidden" name="ids"/>
</form>
<!-- ui -->
<script src="<%=request.getContextPath()%>/static/js/ui/ui-main.js"></script>
<script>

    // 管道
    var $pipeline = $('#JQ_pipeline').select3();
    // 管段
    var $segment = $('#JQ_segment').select3({
        title:'管段'
    });
    // 起点位置
    var $begin = $('#JQ_begin').select3({
        title: '起点位置',
        server: true,
        param: {'pipeLineId':$pipeline,'pipeSegmentId':$segment}
    });
    // 终点位置
    var $end = $('#JQ_end').select3({
        title:'终点位置',
        server: true,
        param: {'pipeLineId':$pipeline,'pipeSegmentId':$segment,'beginSignId':$begin}
    });

    // 触发管道
    $pipeline.element.on('select',function(e,v){
        var id = v || $pipeline.val();
        if(id){
            // 管段
            DyyBase.ajax(DyyBase.url_segment(), {pipeLineId:id}, function(dataset){
                var json = DyyBase.getSelect(dataset);
                $segment.add(json);
            });
            // 起点 & 终点
            DyyBase.ajax(DyyBase.url_pipe_pos(), {pipeLineId:id}, function(dataset){
                var begin = DyyBase.getPos(dataset,'begin');
                var end = DyyBase.getPos(dataset,'end');
                $begin.asset(begin);
                $end.asset(end);
            });
        }else{
            $segment.add([]);
            $begin.add([]);
            $end.add([]);
        }
    });
    // 触发管段
    $segment.element.on('select',function(e,v){
        var pipeId = $pipeline.val();
        var id = v || $segment.val();
        if(id){
            // 起点 & 终点
            DyyBase.ajax(DyyBase.url_segment_pos(), {pipeSegmentId:id}, function(dataset){
                var begin = DyyBase.getPos(dataset,'begin');
                var end = DyyBase.getPos(dataset,'end');
                $begin.asset(begin);
                $end.asset(end);
            });
        }else{
            $begin.add([]);
            $end.add([]);
        }
    });

</script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/pig/cleanPipeLineHistory.js"></script>

</body>
</html>